<template>
	<view class="root">
		<!-- <view class="menu"></view> -->
		<view class="content" style="background-color: #F0F3FD;">
			<view class="top">
				<view class="left">
					<text class="bed-count-text single-text">床位数</text>
					<text class="bed-count number-text">{{bedStatic.bedCount}}</text>
					<text class="patient-count-text single-text">人数</text>
					<text class="patient-count number-text">{{bedStatic.patientCount}}</text>
				</view>

				<view v-if="initInfo.deviceTypeSub=='101'" class="v-quilt-str">{{quiltStrRef}}</view>


				<scroll-view scroll-x="true" class="scroll-view-area"
					v-if="initInfo.deviceTypeSub=='102'&&areaListRef.length>1" :show-scrollbar="false">

					<view class="item" v-for="(item, index) in areaListRef" :key="index" @click="selectArea(index)">

						<view class="v-area-name">{{item.areaName}}</view>
						<view class="v-area-line" v-if="item.selected"></view>

					</view>


				</scroll-view>


				<view class="right">
					<text class="day single-text">{{currentDate}}</text>
					<text class="week single-text">{{currentWeek}}</text>
					<text class="time number-text">{{currentTime}}</text>
				</view>
			</view>
			<view>
				<swiper class="bed-list-swiper" @change="onSwiperChange">
					<swiper-item v-for="(item, index) in bedGroupList" :key="index">
						<uni-grid :column="5" :showBorder="false" borderColor="#00000000">
							<view v-for="(d, position) in item.list" :key="position">
								<view class="bed-item" @click="showBedDialog(d)">
									<view class="bed-item-bed-number">
										{{getBedName(d)}}



									</view>

									<view v-if="d.patient!=undefined&&d.patient!=null">
										<text class="bed-item-name">{{getPrivateName(d.patient.patientName)}}</text>
										<view class="bed-item-age-sex">
											{{ d.patient.patientSex === 1 ? '男' : '女'}}
											<text class="age">{{d.patient.patientAge}}</text>
										</view>


									</view>

									<view :style="{ color: d.patient.nursingLevelColor ,
												backgroundColor:d.patient.nursingLevelBackgroundColor}" class="bed-item-patient-level"
										v-if="d.patient!=undefined&&d.patient!=null">
										{{d.patient.nursingLevelName}}
									</view>
									<image src="/static/image_bed_logo.png" class="bed-item-img-bed" v-else></image>
								</view>
							</view>
						</uni-grid>


					</swiper-item>

				</swiper>
				<!-- 自定义指示器 -->
				<view slot="indicator" class="custom-indicator">
					<view v-for="(item, index) in bedGroupList" :key="index"
						:class="['indicator-item', { active: current === index }]"></view>
				</view>

			</view>
		</view>
		<uni-popup ref="bedPopRef" background-color="#fff">
			<view class="bed-pop">
				<view class="top-info">
					<view class="bed-info">

						<view class="bed-info-top " :class="getCommonBedInfoTop()">
							<view class="bed-container" :class="getBedContainer()">
								<view v-if="bedInfo.showRoom">

									<text class="room-number">{{bedInfo.roomName}}</text>
									<text class="room-number-text"> 房</text>
								</view>
								<view>

									<text class="bed-number">{{bedInfo.bedName}}</text>
									<text class="bed-number-text"> 床</text>
								</view>


							</view>
							<view class="patient" :class="getCommonPatientNone()">
								<text class="patient-name">{{getPrivateName(patientInfoRef.patientName)}}</text>
								<view class="age-sex">
									<text class="age">{{patientInfoRef.patientAge}}</text>
									<text class="sex"> {{ patientInfoRef.patientSex === 1 ? '男' : '女'}}</text>
								</view>
							</view>
							<!-- 		v-if="bedInfo.patient!=null&&boundaryConfigRef.displayQrCode=='display'" -->
							<view class="v-qcode" v-if="qrCodeUrl!=null">
								<image :src="qrCodeUrl" class="qcode"></image>

								<!-- <canvas id="qrcodeCanvas" canvas-id="qrcodeCanvas" class="qcode"></canvas> -->
							</view>
						</view>
						<view class="bed-info-bottom">

							<view class="nursing-level">
								<text class="first-text">护理等级</text>
								<view class="nursing-level-value" :style="{ color: patientInfoRef.nursingLevelColor ,
									backgroundColor:patientInfoRef.nursingLevelBackgroundColor}"
									:class="getLevelClass(patientInfoRef.nursingLevel)" v-if="patientInfoRef!=null">
									{{patientInfoRef.nursingLevelName}}
								</view>

								<view v-else class="second-text">-</view>

							</view>
							<view class="charge-type">
								<text class="first-text" v-if="patientInfoRef!=null">费用类别</text>
								<text class="first-text" v-else>费用类别</text>

								<view class="second-text" v-if="patientInfoRef!=null">城镇医保</view>
								<view v-else class="second-text">-</view>
							</view>
							<view class="in-day">
								<text class="first-text"
									v-if="patientInfoRef!=null">{{patientInfoRef.inDateLabel}}</text>
								<text class="first-text" v-else>入院日期</text>

								<view class="second-text" v-if="patientInfoRef!=null"> {{patientInfoRef.inDate}}
								</view>
								<view v-else class="second-text">-</view>
							</view>
							<view class="hos-number">


								<text class="first-text"
									v-if="patientInfoRef!=null">{{patientInfoRef.hospitalNoLabel}}</text>
								<text class="first-text" v-else>住院编号</text>


								<view class="second-text" v-if="patientInfoRef!=null">{{patientInfoRef.hospitalNo}}
								</view>
								<view v-else class="second-text">-</view>
							</view>
							<view class="doctor">
								<text class="first-text"
									v-if="patientInfoRef!=null">{{patientInfoRef.doctor.nameLabel}}</text>
								<text class="first-text" v-else>主治医生</text>

								<view class="second-text" v-if="patientInfoRef!=null">{{patientInfoRef.doctor.name}}
								</view>
								<view v-else class="second-text">-</view>
							</view>
							<view class="nerse">
								<text class="first-text"
									v-if="patientInfoRef!=null">{{patientInfoRef.nurse.nameLabel}}</text>
								<text class="first-text" v-else>责任护士</text>
								<view class="second-text" v-if="patientInfoRef!=null">{{patientInfoRef.nurse.name}}
								</view>
								<view v-else class="second-text">-</view>
							</view>


						</view>
					</view>
					<view class="notice-info">
						<uni-list :border="false">
							<view v-for="(item, index) in precautions" :key="index" class="notice-item">
								<view class="notice-item-title">{{item.label}}</view>
								<!-- 这个文字，超出，要自动滚动，不要打省略号 -->
								<text class="scrolling-text-container">
									<text class="notice-item-content" :class="getNoticeContentClass(item.value)">
										{{item.value}}
									</text>
								</text>

							</view>
						</uni-list>
					</view>


				</view>
				<view class="bottom-info">

					<view v-for="(item, index) in deviceManageBedList" :key="index" class="menu"
						@click="handMenu(item)">
						<image :src="item.imageUrl" class="img-bottom"></image>
						<text class="second-text">{{item.title}}</text>

					</view>



				</view>



			</view>
		</uni-popup>

	</view>
</template>

<script setup>
	import * as httpConfig from "../../common/http-config.js";
	import * as DataUtils from "../../utils/DataUtils";
	import QRCode from 'qrcode'; // 引入 qrcode.js
	import {
		ref,
		getCurrentInstance,
		onMounted,
		onUnmounted,
		computed,
		defineComponent,
		reactive
	} from 'vue'
	import {
		onLoad
	} from '@dcloudio/uni-app'
	const current = ref(0);
	const levelClass = ref(["level-0", "level-1", "level-2", "level-3"])
	const textevelClass = ref(["level-0-text", "level-1-text", "level-2-text", "level-3-text"])
	const bedGroupList = ref([])
	const precautions = ref(null)

	const bedInfo = ref(null)
	const bedStatic = reactive({
		"bedCount": 0,
		"patientCount": 0
	})

	// 获取当前组件实例
	const instance = getCurrentInstance()
	// 初始化信息
	const initInfo = ref({})

	// 定义响应式变量
	const currentDate = ref('');
	const currentWeek = ref('');
	const currentTime = ref('');

	// 更新时间的方法
	const updateTime = () => {
		const now = new Date();
		// 更新日期
		currentDate.value = formatDate(now);
		// 更新星期
		currentWeek.value = getWeekDay(now);
		// 更新时间
		currentTime.value = formatTime(now);
	};

	// 格式化日期
	const formatDate = (date) => {
		const year = date.getFullYear();
		const month = String(date.getMonth() + 1).padStart(2, '0');
		const day = String(date.getDate()).padStart(2, '0');
		return `${year}年${month}月${day}日`;
	};

	// 获取星期
	const getWeekDay = (date) => {
		const weekDays = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
		return weekDays[date.getDay()];
	};

	// 格式化时间
	const formatTime = (date) => {
		const hours = String(date.getHours()).padStart(2, '0');
		const minutes = String(date.getMinutes()).padStart(2, '0');
		const seconds = String(date.getSeconds()).padStart(2, '0');
		return `${hours}:${minutes}:${seconds}`;
	};
	const getBedName = (value) => {
		if (value.showRoom) {
			return value.roomName + "房 " + value.bedName + "床"
		} else {
			return value.bedName


		}

	};
	const getCommonBedInfoTop = () => {
		if (DataUtils.isEmpty(patientInfoRef.value)) {
			return "common-bed-info-top-left";
		} else {
			return "common-bed-info-top-center";
		}


	};

	const getBedContainer = () => {
		if (DataUtils.isEmpty(patientInfoRef.value)) {
			return "bed-container-left";
		} else {
			return "bed-container-center";
		}



	};
	const getCommonPatientNone = () => {
		if (DataUtils.isEmpty(qrCodeUrl.value)) {
			return "common-patient-none";
		} else {
			return "common-patient-max";
		}



	};





	let timer = null
	onMounted(() => {
		console.log("onMounted 节点挂载了")
		if (instance?.proxy?.$globalData?.initInfo) {
			let jsonStr = instance.proxy.$globalData.initInfo;
			console.log("onMounted jsonStr = " + jsonStr)
			initInfo.value = JSON.parse(jsonStr)
			console.log("onMounted initInfo = " + initInfo.value)
			initData()
			boundaryConfigForManager(initInfo.value["deviceId"])

		}
		updateTime(); // 初始化时间
		timer = setInterval(updateTime, 1000); // 每秒更新一次

		// 暴露方法,更新配置
		window["onSettingChange"] = () => {
			console.log("onSettingChange ")
			if (initInfo.value) {
				boundaryConfigForManager(initInfo.value["deviceId"])
			}

		}

		//普通管理机托管变更的消息通知
		window["onTrusteeshipMsg"] = () => {
			console.log("onTrusteeshipMsg ")
			//查询自己是否被托管
			trusteeshipQuilt(initInfo.value["areaId"])

		}
		//托管管理机在岗离岗状态更新
		window["onTrusteeshipSet"] = () => {
			console.log("onTrusteeshipSet ")
			initData()

		}

		//病人信息变更
		window["onPatientChange"] = () => {
			console.log("onPatientChange ")
			initData()

		}


	});
	onLoad((option) => {
		//获取浏览器的参数，如果不为空，则拿浏览器的参数，请求接口
		const areaId = option.areaId;
		console.log("areaId = " + areaId);
		if (!DataUtils.isEmpty(areaId)) {
			// 通过 options 获取参数
			initInfo.value["areaId"] = areaId
			initData()
		}

	})
	// 使用 onUnmounted 钩子
	onUnmounted(() => {
		if (timer) {
			clearInterval(timer);
		}

	});

	const onSwiperChange = (e) => {
		current.value = e.detail.current; // 更新当前页面索引
		console.log("onSwiperChange...${this.current.value}")
	}
	//根据护理等级返回背景样式
	const getLevelClass = (nursingLevel) => {
		console.log("getLevelClass..." + nursingLevel);
		return levelClass.value[nursingLevel];
	};
	//根据护理等级返回背景样式
	const getTextLevelClass = (nursingLevel) => {
		console.log("getTextLevelClass..." + nursingLevel);
		if (DataUtils.isEmpty(nursingLevel)) {
			return textevelClass.value[3];
		}
		return textevelClass.value[nursingLevel];
	};
	//根据护理等级返回背景样式
	const getNoticeContentClass = (content) => {
		console.log("getNoticeContentClass...");
		if (content.length > 10) {
			return "scrolling-text";
		} else {
			return "";
		}

	};


	//获取数数据
	const initData = () => {
		let deviceTypeSub = initInfo.value.deviceTypeSub
		//101-普通管理机,102-托管管理机
		if (deviceTypeSub == "102") {
			//获取自己托管下面的病区列表，包含自己
			trusteeshipList(initInfo.value["deviceId"])
		} else {
			//查询自己是否被托管
			trusteeshipQuilt(initInfo.value["areaId"])
			//获取自己病区的病床列表
			bedList(initInfo.value["areaId"])

		}

	};




	// 获取自己托管下面的病区列表，包含自己
	const trusteeshipList = async (deviceId) => {
		uni.request({
			url: httpConfig.baseURL + httpConfig.trusteeshipList, // 请求的 URL
			method: 'POST', // 请求方法为 POST
			data: {
				"deviceId": deviceId
			},
			success: (res) => {
				if (res.data.code == httpConfig.successCode) {
					if (!DataUtils.isEmpty(res.data.data)) {
						areaListRef.value = res.data.data
						selectArea(0)
					} else {
						console.error('trusteeshipList 请求数据为空', res.data.data);
					}
				}
				// 在这里处理请求成功的情况
			},
			fail: (err) => {
				console.error('Request failed trusteeshipList', err);

				// 在这里处理请求失败的情况
			}
		});
	};
	const areaListRef = ref([])
	const selectArea = async (index) => {
		for (let i = 0; i < areaListRef.value.length; i++) {
			if (i == index) {
				areaListRef.value[i]["selected"] = true
			} else {
				areaListRef.value[i]["selected"] = false
			}
		}

		//查询当前病区病床列表
		bedList(areaListRef.value[index].areaId)
	}
	const quiltStrRef = ref("")
	// 查询自己是否被托管
	const trusteeshipQuilt = async (areaId) => {
		uni.request({
			url: httpConfig.baseURL + httpConfig.trusteeshipQuilt, // 请求的 URL
			method: 'POST', // 请求方法为 POST
			data: {
				"areaId": areaId
			},
			success: (res) => {
				console.log('trusteeshipQuilt 查询自己是否被托管 ' + res.data.data);
				if (res.data.code == httpConfig.successCode) {
					if (!DataUtils.isEmpty(res.data.data)) {

						const quiltStr = res.data.data?.map(d => `${d.areaName}-${d.deviceName}`)
							?.join(",");
						quiltStrRef.value = "设备托管中(" + quiltStr + ")托管时病区所有呼叫将转移到托管设备"

					} else {
						console.error('trusteeshipQuilt 请求数据为空', res.data.data);
						quiltStrRef.value = ""
					}
				}
				// 在这里处理请求成功的情况
			},
			fail: (err) => {
				console.error('Request failed trusteeshipQuilt', err);
				// 在这里处理请求失败的情况
			}
		});
	};


	// 获取病床列表信息
	const bedList = async (areaId) => {
		bedGroupList.value = [];
		bedStatic["bedCount"] = 0
		bedStatic["patientCount"] = 0
		uni.request({
			url: httpConfig.baseURL + httpConfig.bedList, // 请求的 URL
			method: 'POST', // 请求方法为 POST
			data: {
				"areaId": areaId,
				"deviceType": initInfo.value["deviceType"]
			},
			success: (res) => {
				console.log('病床一栏数据 ' + res.data.data);
				if (res.data.code == httpConfig.successCode) {
					if (!DataUtils.isEmpty(res.data.data)) {
						let dataList = res.data.data;
						handBedList(dataList)
					} else {
						console.error('请求数据为空', res.data.data);
					}
				}
				// 在这里处理请求成功的情况
			},
			fail: (err) => {
				console.error('Request failed employeeInfo', err);
				// 在这里处理请求失败的情况
			}
		});
	};
	///处理返回的病床数据
	const handBedList = (dataList) => {
		const count = dataList.filter(item => {
			return item.patient && Object.keys(item.patient).length > 0;
		}).length;
		//统计病人，病床的数量
		bedStatic["bedCount"] = dataList.length
		bedStatic["patientCount"] = count
		// 分页处理
		const pageSize = 25; // 每页 25 个
		let pageIndex = 0; // 当前页索引0
		bedGroupList.value = []
		for (let i = 0; i < dataList.length; i += pageSize) {
			const pageData = dataList.slice(i, i + pageSize); // 获取当前页的数据
			let bedData = {
				"id": dataList[i].bedId,
				"list": pageData
			}
			bedGroupList.value.push(bedData)
			pageIndex++;
		}
	}
	// 使用 ref 函数创建引用变量
	const bedPopRef = ref(null)
	const patientInfoRef = ref(null)

	const showBedDialog = (value) => {
		bedInfo.value = value
		bedPopRef.value.open(); // 调用 uni-popup 的 open 方法
		getDeviceManageBedList(value.bedId)
		// boundaryConfig(value.deviceId)
		patientInfo(value.bedId)

	};


	const patientInfo = (bedId) => {
		patientInfoRef.value = null
		qrCodeUrl.value = null
		precautions.value = [{
				"label": "饮食",
				"value": "无"
			},
			{
				"label": "安全防护",
				"value": "无"
			},
			{
				"label": "过敏",
				"value": "无"
			},
			{
				"label": "隔离",
				"value": "无"
			},

			{
				"label": "注意",
				"value": "无"
			}
		]
		uni.request({
			url: httpConfig.baseURL + httpConfig.patientInfo, // 请求的 URL
			method: 'POST', // 请求方法为 POST
			data: {
				"bedId": bedId
			},
			success: (res) => {

				if (res.data.code == httpConfig.successCode) {
					if (!DataUtils.isEmpty(res.data.data)) {
						console.log('病人信息数据 ' + res.data.data);
						if (res.data.data.patientId <= 0) {
							patientInfoRef.value = null
						} else {
							patientInfoRef.value = res.data.data
							precautions.value = patientInfoRef.value.precautions
							if (!DataUtils.isEmpty(patientInfoRef.value.qrcodeContent)) {
								generateQRCode(patientInfoRef.value.qrcodeContent)
							}


						}

					} else {
						console.log('请求数据为空 patientInfo ' + res.data.data);
					}
				}
				// 在这里处理请求成功的情况
			},
			fail: (err) => {
				console.log('Request failed patientInfo' + err);

			}
		});




		if (value.patient != null) {
			if (!DataUtils.isEmpty(value.patient.precautions)) {
				precautions.value = value.patient.precautions
			}

		} else {
			precautions.value = [{
					"label": "饮食",
					"value": "无"
				},
				{
					"label": "安全防护",
					"value": "无"
				},
				{
					"label": "过敏",
					"value": "无"
				},
				{
					"label": "隔离",
					"value": "无"
				},

				{
					"label": "注意",
					"value": "无"
				}
			]
		}

	};
	//点击床头卡的菜单
	const handMenu = (item) => {
		console.log("handMenu item = " + item)
		bedPopRef.value.close(); // 调用 uni-popup 的 open 方法
		if (item.routeAddr == "voiceCall" || item.routeAddr == "videoCall") {
			callBedFromJs(item)
		} else {
			if (item.routeAddr == "CallRecord") {
				window.hb.refreshCallRecordByBedId(item.routeAddr, bedInfo.value.bedId)
			} else {
				window.hb.handMenu(item.routeAddr)
			}

		}

	}
	const callBedFromJs = (item) => {
		if (DataUtils.isEmpty(bedInfo.value.deviceCall)) {
			uni.showToast({
				title: '设备未配置',
				icon: "error",
				duration: 2000
			});
			return

		}
		if (DataUtils.isEmpty(bedInfo.value.deviceCall.remoteAccount)) {
			uni.showToast({
				title: '设备未配置号码',
				icon: "error",
				duration: 2000
			});
			return
		}
		if (DataUtils.isEmpty(bedInfo.value.deviceCall.remoteIp)) {
			uni.showToast({
				title: '设备未配置IP',
				icon: "error",
				duration: 2000
			});
			return
		}
		let videoType = "0"
		// 语音呼叫
		if (item.routeAddr == "voiceCall") {
			videoType = "0"
		}
		// 视频呼叫
		if (item.routeAddr == "videoCall") {
			videoType = "1"
		}

		window.hb.callBedFromJs(bedInfo.value.bedId, bedInfo.value.bedName, bedInfo.value.deviceName, bedInfo.value
			.patient == null ? "-1" : bedInfo.value
			.patient.nursingLevel, bedInfo
			.value.deviceCall.remoteAccount, bedInfo.value.deviceCall.remoteIp, videoType);
	}


	const deviceManageBedList = ref([{
		"id": 1,
		"title": "呼叫患者",
		"imageUrl": "/static/icon_voice_call.png",
		"imageColorUrl": "/static/icon_voice_call.png",
		"routeType": "native",
		"routeAddr": "voiceCall",
	}, {
		"id": 2,
		"title": "视频呼叫",
		"imageUrl": "/static/icon_video_call.png",
		"imageColorUrl": "/static/icon_video_call.png",
		"routeType": "native",
		"routeAddr": "videoCall",
	}])

	// 床头机床头卡功能菜单
	const getDeviceManageBedList = async (bedId) => {
		uni.request({
			url: httpConfig.baseURL + httpConfig.deviceManageBedList, // 请求的 URL
			method: 'POST', // 请求方法为 POST
			data: {
				"deviceId": initInfo.value["deviceId"],
				"bedId": bedId
			},
			success: (res) => {
				console.log('床头机床头卡功能菜单数据 ' + res.data.data);
				if (res.data.code == httpConfig.successCode) {
					if (!DataUtils.isEmpty(res.data.data)) {
						deviceManageBedList.value = res.data.data


					} else {
						console.log('请求数据为空' + res.data.data);
					}
				}
				// 在这里处理请求成功的情况
			},
			fail: (err) => {
				console.log('Request failed deviceManageBedList' + err);
				// 在这里处理请求失败的情况
			}
		});
	};

	const boundaryConfigRef = ref(null)



	// 设备配置接口
	const boundaryConfig = async (deviceId) => {
		boundaryConfigRef.value = null
		qrCodeUrl.value = null
		uni.request({
			url: httpConfig.baseURL + httpConfig.boundaryConfig, // 请求的 URL
			method: 'POST', // 请求方法为 POST
			data: {
				"deviceId": deviceId
			},

			success: (res) => {
				console.log('设备配置接口' + JSON.stringify(res.data));
				if (res.data.code == httpConfig.successCode) {
					if (!DataUtils.isEmpty(res.data.data)) {
						boundaryConfigRef.value = res.data.data
						//敏感
						// if (boundaryConfigRef.value.sensitive == 1) {
						// 	setPrivateName(boundaryConfigRef.value.privacyPolicy, boundaryConfigRef
						// 		.value.privacyCharacter)
						// }
						console.log(JSON.stringify(bedInfo.value))
						if (!DataUtils.isEmpty(boundaryConfigRef.value.qrCodeField)) {
							generateQRCode(boundaryConfigRef.value.qrCodeField)
						}

					}

				}
				// 在这里处理请求成功的情况
			},
			fail: (err) => {
				console.log('设备配置接口异常' + res.data);
				// 在这里处理请求失败的情况
			}
		});
	};


	const boundaryConfigForManagerRef = ref(null)

	// 管理机自己的设备配置接口
	const boundaryConfigForManager = async (deviceId) => {
		uni.request({
			url: httpConfig.baseURL + httpConfig.boundaryConfig, // 请求的 URL
			method: 'POST', // 请求方法为 POST
			data: {
				"deviceId": deviceId
			},

			success: (res) => {
				console.log('设备配置接口' + JSON.stringify(res.data));
				if (res.data.code == httpConfig.successCode) {
					if (!DataUtils.isEmpty(res.data.data)) {
						boundaryConfigForManagerRef.value = res.data.data


						// //敏感
						// if (boundaryConfigRef.value.sensitive == 1) {
						// 	setPrivateName(boundaryConfigRef.value.privacyPolicy, boundaryConfigRef
						// 		.value.privacyCharacter)
						// }

					}

				}
				// 在这里处理请求成功的情况
			},
			fail: (err) => {
				console.log('设备配置接口异常' + res.data);
				// 在这里处理请求失败的情况
			}
		});
	};


	// 
	const getPrivateName = (patientName) => {
		console.log("getPrivateName patientName " + patientName.length)
		if (DataUtils.isEmpty(patientName) || patientName.length < 2 || DataUtils.isEmpty(
				boundaryConfigForManagerRef.value)) {
			return patientName

		}

		if (boundaryConfigForManagerRef.value.sensitive == 0) {
			return patientName
		}
		let privacyCharacter = boundaryConfigForManagerRef.value.privacyCharacter
		let privacyPolicy = boundaryConfigForManagerRef.value.privacyPolicy

		if (DataUtils.isEmpty(privacyCharacter) || DataUtils.isEmpty(privacyPolicy)) {
			return patientName

		}

		let privateName = patientName
		if (patientName.length == 2) {
			let firstName = getFirstCharacter(patientName)
			privateName = firstName + privacyCharacter
			console.log("privateName = " + privateName + ",firstName = " + firstName)

		} else {
			//中间隐私
			if (privacyPolicy == "middle_privacy") {
				let firstName = getFirstCharacter(patientName)
				let lastName = getLastCharacter(patientName)
				privateName = firstName + privacyCharacter + lastName

			}
			//末尾隐私
			if (privacyPolicy == "last_privacy") {
				let firstName = getFirstCharacter(patientName)
				let secondName = getSecondCharacter(patientName)
				privateName = firstName + secondName + privacyCharacter
			}
		}
		return privateName



	};
	// 获取字符串的第一个字符
	function getFirstCharacter(str) {
		if (typeof str !== 'string' || str.length === 0) {
			return ''; // 如果输入不是字符串或为空，返回空字符串
		}
		return str.charAt(0); // 返回第一个字符
	}
	// 获取字符串的第二个字符
	function getSecondCharacter(str) {
		if (typeof str !== 'string' || str.length === 0) {
			return ''; // 如果输入不是字符串或为空，返回空字符串
		}
		return str.charAt(1); // 返回第一个字符
	}

	// 获取字符串的最后一个字符
	function getLastCharacter(str) {
		if (typeof str !== 'string' || str.length === 0) {
			return ''; // 如果输入不是字符串或为空，返回空字符串
		}
		return str.charAt(str.length - 1); // 返回最后一个字符
	}

	const qrCodeUrl = ref("")

	// 设备配置接口
	const generateQRCode = async (data) => {
		try {
			console.log("generateQRCode " + data)
			const qrCodeData = await QRCode.toDataURL(data);
			qrCodeUrl.value = qrCodeData;
		} catch (error) {
			// 可以根据具体情况进行错误处理，比如返回默认值或向用户显示错误信息
			return null;
		}
	};
</script>

<style lang="less" scoped>
	@vw: 8.015vw;
	@vh: 5.4vh;

	.common-bed-info-top-center {

		justify-content: center;
	}

	.common-bed-info-top-left {

		justify-content: left;
	}

	.bed-container-left {
		margin-left: 80/@vw;

	}

	.bed-container-center {
		margin-left: 0px;
	}

	.common-patient-max {
		max-width: 120/@vw;
	}

	.common-patient-none {
		max-width: 150/@vw;
	}


	.scrolling-text-container {
		width: 300px;
		overflow: hidden;
		white-space: nowrap;
		background-color: #F3F6FA;
		font-size: 10/@vh;
		padding-left: 6/@vw;
		width: 107/@vw;
		line-height: 28/@vh;
		height: 100%;
		white-space: nowrap;
		/* 强制文本一行显示 */
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.scrolling-text {
		display: inline-block;
		//padding-left: 100%; /* 初始位置在容器右侧 */
		animation: scroll 6s linear infinite;
	}

	@keyframes scroll {
		0% {
			transform: translateX(0);
		}

		100% {
			transform: translateX(-100%);
		}
	}



	.menu {
		width: 158.5/@vw;
	}

	.content {
		display: flex;
		width: 801.5/@vw;
		flex-direction: column;
	}

	.top {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		height: 34/@vh;
		padding-left: 14/@vw;
		padding-right: 16/@vw;
		background-color: white;

		.v-quilt-str {
			margin-left: 10/@vw;
			margin-right: 10/@vw;
			font-size: 10/@vh;
			white-space: nowrap;
			/* 强制文本一行显示 */
			overflow: hidden;
			text-overflow: ellipsis;
			color: #2C2E30;
		}

		.scroll-view-area {

			flex: 1;
			white-space: nowrap;
			/* 防止内容换行 */
			height: 100%;

			overflow: auto;
			padding-left: 10/@vw;
			padding-right: 10/@vw;


			.item {
				display: inline-block;
				height: 100%;
				min-width: 80/@vw;
				max-width: 150/@vw;
				position: relative;

				.v-area-name {
					font-size: 12/@vh;
					color: #2C2E30;
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translate(-50%, -50%);
				}

				.v-area-line {
					width: 50/@vw;
					height: 2/@vh;
					background-color: #0E69F8;
					position: absolute;
					bottom: 2/@vh;
					border-radius: 3/@vh;
					left: 50%;
					transform: translateX(-50%)
				}

			}

		}

		.single-text {
			font-size: 13/@vh;
			color: #2C2E30;
		}

		.number-text {
			font-size: 14/@vh;
			color: #2C2E30;
			font-weight: bold;
		}

		.bed-count {
			margin-left: 6/@vw;
		}

		.patient-count-text {
			margin-left: 24/@vw;
		}

		.patient-count {
			margin-left: 6/@vw;
		}

		.week {
			margin-right: 9/@vw;
		}

		.day {
			margin-right: 9/@vw;
		}
	}

	.bed-list-swiper {
		height: 506/@vh;

	}

	uni-grid {
		display: flex;
		flex-wrap: wrap;
		width: 100%;
		padding-left: 4/@vw;
		padding-top: 4/@vh;
	}

	.bed-item {
		margin-left: 8/@vw;
		margin-top: 8/@vh;
		width: 149.1/@vw;
		height: 90/@vh;
		display: flex;
		flex-direction: column;
		background-color: white;
		border-radius: 3/@vh;
		position: relative;


		.bed-item-patient-level {
			border-radius: 4/@vh;

			width: 28/@vw;
			height: 36/@vh;
			display: flex;
			justify-content: center;
			align-items: center;
			position: absolute;
			right: 4/@vw;
			bottom: 4/@vh;
			font-size: 9/@vh;
			font-weight: bold;

		}

		.bed-item-bed-number {
			margin-left: 10/@vw;
			margin-top: 6/@vh;
			font-size: 17/@vh;
			color: #2C2E30;
			font-weight: bold;

			white-space: nowrap;
			/* 强制文本一行显示 */
			overflow: hidden;
			text-overflow: ellipsis;
		}

		.bed-item-name {
			margin-top: 20/@vh;
			margin-left: 10/@vw;
			font-size: 14/@vh;
			line-height: 25/@vh;
			color: #2C2E30;
			font-weight: bold;
			max-width: 85/@vw;
			white-space: nowrap;
			/* 强制文本一行显示 */
			overflow: hidden;
			text-overflow: ellipsis;
		}

		.bed-item-age-sex {
			margin-top: 8/@vh;
			margin-left: 10/@vw;
			display: flex;
			flex-direction: row;
			align-items: center;
			font-size: 13/@vh;

			.age {
				margin-left: 12/@vw;
			}
		}

		.bed-item-img-bed {
			width: 37/@vw;
			height: 37/@vw;
			margin-top: 18/@vh;
			position: absolute;
			top: 20/@vh;
			left: 50%;
			transform: translateX(-50%);

		}
	}

	.custom-indicator {
		display: flex;
		justify-content: center;
		align-items: center;
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
	}

	.indicator-item {

		/* 未选中指示器颜色 */
		transition: all 0.3s ease;
		width: 5/@vw;
		height: 5/@vw;
		border-radius: 50%;
		background-color: #86A9DD;
		margin: 5px;
	}

	.indicator-item.active {
		width: 14/@vw;
		height: 4@vh;
		border-radius: 8/@vh;
		background-color: #0E69F8;
		/* 选中指示器颜色 */
	}


	.bed-pop {
		background-color: #F0F3FD;
		width: 512/@vw;
		height: 269/@vh;

		display: flex;
		flex-direction: column;

		.top-info {
			margin-top: 6/@vh;
			height: 176/@vh;
			display: flex;
			flex-direction: row;

			.bed-info {
				border-radius: 5/@vh;
				margin-left: 6/@vw;
				width: 329/@vw;
				height: 176/@vh;
				background-color: white;
				display: flex;
				flex-direction: column;


				.bed-info-top {
					display: flex;
					flex-direction: row;
					align-items: center;
					height: 92/@vh;
					width: 100%;
					background-color: #0F6AF8;
					border-radius: 5/@vh 5/@vh 15/@vh 15/@vh;

					.bed-container {
						display: flex;
						flex-direction: column;

						.room-number {
							font-size: 22/@vh;
							color: white;
							font-weight: bold;

						}

						.room-number-text {
							color: white;
							font-size: 13/@vh;
						}

						.bed-number {
							font-size: 30/@vh;
							color: white;

							font-weight: bold;

						}

						.bed-number-text {
							color: white;
							font-size: 17/@vh;
						}

					}



					.patient {
						white-space: nowrap;
						/* 强制文本一行显示 */
						overflow: hidden;
						text-overflow: ellipsis;
						display: flex;
						flex-direction: column;
						height: 100%;

						justify-content: center;
						margin-left: 22/@vw;
						margin-right: 22/@vw;

						.patient-name {
							color: white;
							font-weight: bold;
							font-size: 24/@vh;
							white-space: nowrap;
							/* 强制文本一行显示 */
							overflow: hidden;
							text-overflow: ellipsis;

						}

						.age-sex {
							margin-top: 3/@vh;

							.age {
								font-size: 15/@vh;
								color: white;
							}

							.sex {
								margin-left: 7/@vw;
								font-size: 15/@vh;
								color: white;
							}
						}
					}

					.v-qcode {

						display: flex;
						justify-content: center;
						align-items: center;
						width: 57/@vw ;
						height: 57/@vw ;
						background-color: white;
						border-radius: 7/@vh;

						.qcode {
							width: 52/@vw;
							height: 52/@vh;
						}

					}

				}

				.bed-info-bottom {

					.first-text {
						color: #7F848C;
						font-size: 10/@vh;

					}

					.second-text {
						color: #222222;
						margin-left: 10/@vw;
						font-size: 10/@vh;
					}


					.nursing-level {
						display: flex;
						flex-direction: row;
						align-items: center;
						position: absolute;
						margin-left: 12/@vw;
						margin-top: 16/@vh;

						.nursing-level-value {
							border-radius: 4/@vh;
							margin-left: 10/@vw;
							font-size: 10/@vh;
							width: 71/@vw;
							height: 18/@vh;
							display: flex;
							justify-content: center;
							align-items: center;

							font-weight: bold;

						}
					}

					.charge-type {
						display: flex;
						align-items: center;
						flex-direction: row;
						position: absolute;
						margin-left: 183/@vw;
						margin-top: 16/@vh;
					}

					.in-day {
						display: flex;
						flex-direction: row;
						align-items: center;
						position: absolute;
						margin-left: 12/@vw;
						margin-top: 38/@vh;
					}

					.hos-number {
						display: flex;
						flex-direction: row;
						align-items: center;
						position: absolute;
						margin-left: 183/@vw;
						margin-top: 38/@vh;
					}

					.doctor {
						display: flex;
						flex-direction: row;
						align-items: center;
						position: absolute;
						margin-left: 12/@vw;
						margin-top: 60/@vh;
					}

					.nerse {
						display: flex;
						flex-direction: row;
						align-items: center;
						position: absolute;
						margin-left: 183/@vw;
						margin-top: 60/@vh;
					}
				}
			}


			.notice-info {
				border-radius: 5/@vh;
				width: 153/@vw;
				margin-left: 6/@vw;
				height: 176/@vh;
				background-color: white;
				padding-left: 6/@vw;
				padding-right: 6/@vw;

				.notice-item {
					margin-top: 6/@vh;
					width: 100%;
					height: 28/@vh;
					display: flex;
					flex-direction: row;
					align-items: center;
					font-size: 8/@vh;

					.notice-item-title {
						background-color: #E1EBF9;
						border-radius: 3/@vw 0px 0px 3/@vw;
						font-size: 10/@vh;
						padding-left: 3/@vw;
						width: 45/@vw;
						line-height: 28/@vh;
						height: 100%;
						white-space: nowrap;
						overflow: hidden;
						text-overflow: ellipsis;
					}



				}
			}



		}

		.bottom-info {
			border-radius: 5/@vh;
			margin-left: 6/@vw;
			margin-top: 6/@vh;
			width: 500/@vw;
			height: 75/@vh;
			background-color: white;
			display: flex;
			flex-direction: row;

			.menu {
				flex: 1;
				justify-content: center;
				align-items: center;
				display: flex;
				flex-direction: column;
				font-size: 10/@vh;


				image {
					margin-top: 6/@vh;
					width: 31/@vw;
					height: 31/@vh;
				}
			}



		}

	}
</style>